<template>
	<view class="">
		<view class="" style="height: 130px;"> </view>
		<view style="padding: 20rpx 40rpx;">
			<view class="login__wrapper">
				<template v-if="settings.is_account==1">
					<view class="login__info tn-flex tn-flex-direction-column tn-flex-col-center tn-flex-row-center">
						<block>
							<view class="flex by1 a-c" style="width: 100%;border: solid 2rpx #DCDCDC;">
								<view class="ml2">
									<text class="bicon">&#xe67b;</text>
								</view>
								<view class=" " style="width: 90%;">
									<input class=" f28" v-model="account" maxlength="20" placeholder="请输入账号/字母+数字" />
								</view>
							</view>
							<view v-if="settings.reg_img_code==1" class="pt5">
								<view class="flex by1 a-c" style="width: 100%;border: solid 2rpx #DCDCDC;">
									<view class="ml2">
										<text class="bicon c_7 f40">&#xe67a;</text>
									</view>
									<view class=" " style="width: 50%;">
										<input class=" f28" v-model="v_code" maxlength="20" placeholder="请输入图形验证码" />
									</view>
									<view class="login__info__item__input__right-verify-code" @tap.stop="get_imgCode">
										<image style="width: 120px;height: 32px;" :src="settings.code_img_rand" mode="">
										</image>
									</view>
								</view>
							</view>
							<view class="pt5">
								<view class="flex by1 a-c " style="width: 100%;border: solid 2rpx #DCDCDC;">
									<view class="ml2">
										<text class="bicon">&#xe6c0;</text>
									</view>
									<view class=" " style="width: 90%;">
										<input class=" f28" v-model="password" type="password" maxlength="20"
											placeholder="请设置密码/字母+数字" />
									</view>
								</view>
							</view>
							<view class="pt5">
								<view class="flex by1 a-c " style="width: 100%;border: solid 2rpx #DCDCDC;">
									<view class="ml2">
										<text class="bicon">&#xe6c0;</text>
									</view>
									<view class=" " style="width: 90%;">
										<input class=" f28" v-model="news_password" type="password" maxlength="20"
											placeholder="请确认密码/字母+数字" />
									</view>
								</view>
							</view>
						</block>
						<view class="flex j-c pt8">
							<view @click="is_login_weixin" class="flex j-c a-c by1   button_bg"
								style=" width: 88%;height: 40px;">
								确认注册
							</view>
						</view>
					</view>
				</template>
				<view class="flex a-c j-c  " style="padding-top: 80rpx;">
					<view @click="on_xieyi" class="b_y flex a-c j-c"
						style="width: 30rpx;height: 30rpx;border: solid 2rpx #A9A9A9;">
						<text v-if="agr" class="f26 " style="color: #A9A9A9;">✓</text>
					</view>
					<text class="f30  ml1  " style="color: #A9A9A9;">我已阅读并同意</text>
					<text class="f30 " style="color: #1E90FF;" @click="article_view(2)">
						隐私条款
					</text>
					<text style="color: #A9A9A9;">和</text>
					<text class="f30 " style="color: #1E90FF;" @click="article_view(1)">
						用户协议
					</text>
				</view>
			</view>
		</view>
		<userTelBang ref="userTelBang" :is_information="is_information">
		</userTelBang>
	</view>
</template>

<script>
	import userTelBang from './user_tel_bang.vue'
	export default {
		components: {
			userTelBang,
		},
		data() {
			return {
				// 模式选中滑块
				modeSliderStyle: {
					left: 0
				},
				// 是否显示密码
				showPassword: false,
				// 倒计时提示文字
				tips: '获取验证码',
				password: '',
				tel: '',
				smscode: '',
				agr: true,
				settings: {},
				news_password: '',
				account: '',
				v_code: '',
				is_information: false,
			}
		},
		onLoad() {
			this.init();
		},
		methods: {
			user_reg() {
				uni.navigateTo({
					url: '/pages/banmi/user_reg'
				})
			},
			init() {
				this.Banmikeji.login_init({}).then(ret => {
					this.settings = ret.settings;
					this.plugin_set = ret.plugin_set;
					this.v_id = ret.settings.v_id;
					console.log("this.v_id : " + JSON.stringify(this.v_id));
				})
			},
			get_imgCode() {
				let data = {
					code_img: this.settings.code_img,
				};
				this.Banmikeji.get_imgCode(data).then(ret => {
					this.settings.code_img_rand = ret.code_img_rand;
					this.v_id = ret.v_id;
				})
			},
			is_login_weixin() {

				if (!this.agr) {
					uni.showToast({
						title: '请勾选同意协议',
						icon: "none"
					});
					return;
				}
				if (!this.account) {
					uni.showToast({
						title: '请输入账号',
						icon: "none"
					});
					return;
				}
				if (!this.password) {
					uni.showToast({
						title: '请输入密码',
						icon: "none"
					});
					return;
				}
				if (!this.news_password) {
					uni.showToast({
						title: '请确认新密码',
						icon: "none"
					});
					return;
				}
				if (this.news_password != this.password) {
					uni.showToast({
						title: '密码和新密码不一致',
						icon: "none"
					});
					return;
				}
				this.is_reg_ajax();
			},
			is_reg_ajax() {
				uni.showLoading({
					title: '正在注册...'
				})

				let requestParams = {
					news_password: this.news_password,
					password: this.password,
					account: this.account,
					id: this.v_id,
					v_code: this.v_code,
				};
				this.Banmikeji.user_reg(requestParams).then(ret => {
					this.basic_information(ret);
				})

			},
			//完善资料
			basic_information(user) {
				this.is_information = true;
				this.user = user;
				this.user.v_code = this.v_code
				this.$refs.userTelBang.zi_init(user, this.settings)
			},

			on_xieyi() {
				this.agr = !this.agr
			},
			article_view(index) {

				if (index == 1) {
						this.article = uni.getStorageSync('article_1');
					 
				} else {
					this.article = uni.getStorageSync('article_2'); 
				}


				uni.navigateTo({
					url: '/pages/banmi/article_view?id=' + this.article
				})
			},
			on_goBack() {
				uni.navigateBack()
			},
			// 获取验证码
			getCode() {
				if (this.is_getCode) {
					return
				}
				if (this.codetime > 0) {
					return;
				}
				let requestParams = {
					phone: this.tel,
					id: this.v_id,
					is_agr: true,
					agr: this.agr
				};
				this.Banmikeji.tel_message(requestParams).then(ret => {
					if (ret == 200) {
						this.is_getCode = true;
						this.tips = 120;
						let timer = setInterval(() => {
							this.tips--;
							if (this.tips < 1) {
								clearInterval(timer);
								this.tips = '获取验证码';
								this.is_getCode = false;
							}
						}, 1000);
					}
				})
			},
			isPhone() {
				let mPattern = /^1[23456789]\d{9}$/;
				return mPattern.test(this.phone);
			},

			is_login() {

				if (!this.tel) {
					uni.showToast({
						title: '请输入手机号',
						icon: 'none'
					});
					return;
				}
				if (!this.agr) {
					uni.showToast({
						title: '请勾选同意协议',
						icon: "none"
					});
					return;
				}

				if (!this.password) {
					uni.showToast({
						title: '请输入密码',
						icon: 'none'
					});
					return;
				}
				let requestParams = {
					tel: this.tel,
					password: this.password,
					id: this.v_id
				};
				this.Http.post('banmi.php/login/pwd_login', requestParams).then(ret => {
					uni.showToast({
						title: ret.msg,
						icon: 'none',
						duration: 4000
					});

					if (ret.status == 200) {
						uni.setStorage({
							key: 'token',
							data: ret.data.user.token
						});
						uni.setStorage({
							key: 'uid',
							data: ret.data.user.uid
						});
						uni.setStorage({
							key: 'nickname',
							data: ret.data.user.nickname
						});

						uni.setStorage({
							key: 'face',
							data: ret.data.user.face
						});

						this.login_ok();

					}
				})


			},


		}
	}
</script>

<style lang="scss" scoped>
	input {
		height: 80rpx;
		margin-left: 20rpx;
	}
</style>